<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>迁移图</title>
        <script include="jquery" src="./static/libs/include-lib-local.js"></script>
        <script include="mapv" src="./static/libs/include-leaflet-local.js"></script>
        <style>
         body {
             margin: 0;
             padding: 0;
         }

         #map {
             position: absolute;
             top: 0;
             bottom: 0;
             width: 100%;
         }
        </style>
    </head>

    <body>
        <div id="map"></div>
        <script>
         var map = L.map('map', {
             crs: L.CRS.EPSG3857
         }).setView([29.578285, 106.563777], 3);

         L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=' +
                     'sk.eyJ1IjoiY2hlbmdkYWRhIiwiYSI6ImNqZDFjaGo0ZjFzcnoyeG54enoxdnNuZHUifQ.hTWXXBUQ0wdGeuDF3GWeUw', {
                         attribution: '<a href="#">MapGIS</a>',
                         maxZoom: 18,
                         id: 'mapbox.dark'
         }).addTo(map);

         var geosjon;

         $.get('./static/data/geojson/point.json', function (json) {
             geojson = json;
             var options = {
                 size: 5,
                 max: 2,
                 field: 'mapgis_style'
             }

             var heaterLayer = new L.zondy.HeaterLayer(map, geojson, options).addTo(map);
         });


        </script>


    </body>

</html>
